/**
 * title: 基本用法
 * description: 可以通过 `registerList` 自定义节点和线条
 */
import React from 'react';
import data from './demoData.json';
import moduleConfig from './moduleConfig';
import assets from '../../../assets';
import Arch from '@rasir/x6-arch';
import registerList from './register';
import 'antd/dist/antd.css';

const App = () => {
  const onCreateNode = (nodeData) => {
    const { name, preId, moduleType } = nodeData;
    return Promise.resolve({
      id: Date.now() + '',
      name,
      shape: 'arch-node',
      type: 'node',
      preId,
      moduleType,
    });
  };

  return (
    <>
      <Arch
        data={data}
        moduleConfig={moduleConfig}
        assets={assets}
        appendActions={<div>hello</div>}
        registerList={registerList}
        defaultNodeShape="node"
        defaultEdgeShape="link"
        onCreateNode={onCreateNode}
        cache={false}
        onChange={(data) => {}}
      />
    </>
  );
};

export default App;
